{template nheader.html}
<link href="{THEME_PATH}admin/global/css/add_video.css" rel="stylesheet"  />
<script src="{THEME_PATH}admin/global/scripts/add_video.js"></script>

<script src="{THEME_PATH}admin/global/scripts/aliyun-upload-sdk1.3.1.min.js"></script>
<script src="{THEME_PATH}admin/global/scripts/aliyun-oss-sdk4.13.2.min.js"></script>


<div class="step-display">
    <div class="active">
        <span>1</span>
        <span>选择课程分类</span>
    </div>
    <div class="active">
        <span>2</span>
        <span>填写课程信息</span>
    </div>
    <div class="active">
        <span>3</span>
        <span>课程发布成功</span>
    </div>
</div>
<form class="form-horizontal" action="{dr_url('publics/addvideo')}" method="post" id="myform" name="myform" style="margin-top:30px;margin-bottom: 70px;">
    <!--<input type="hidden" name="upload_img" value=""/>-->
    <!--<input type="hidden" name="course"/>-->
    <input type="hidden" name="videoid"/>
    <input type="hidden" name="class_id" value="{$class_id}"/>
    <input type="hidden" name="title" value="{$title}"/>
    <input type="hidden" name="content" value="{$content}"/>
    <div class="portlet light bordered">
        <div class="portlet-title">
            <div class="caption">
                <span class="caption-subject font-green bold uppercase">
                    <span style="font-family: FontAwesome;"></span>
                    <!-- {$name} -->
                    <span class="title">
                        {fc_lang('录播课上传')}
                    </span>
                </span>
            </div>
        </div>
        <div class="portlet-body">
            <div class="portlet-body form">
                <div class="form-body">

                    <div class="form-page-3">

                        <div class="form-group record-class-video">
                            <label class="col-md-2 control-label">
                                <span class="le_required">*</span>
                                {fc_lang('上传视频文件')}：
                            </label>
                            <div class="col-md-9">
                                <label>
                                    <label class="update-class-video">
                                        <input type="file" name="file" id="files" multiple/>
                                        <span class="video-msg">未选择任何档案</span>
                                        <span class="update-word-add">
                                            <p>+</p>
                                            <p>上传影片</p>
                                        </span>
                                    </label>
                                    <div class="features">
                                        <button type="button" onclick="clearInputFile()">清空继续选择</button>
                                        <button type="button" onclick="start()">开始上传</button>
                                        <button type="button" onclick="stop()">停止上传</button>
                                        <button type="button" onclick="resumeWithToken()">恢复上传</button>
                                    </div>
                                    <p>支持3GP、ASF、AV、DAT、DV、FLV、F4VGIF、M2TM3UB、M4V、MJ2、MJPG、MKV、MOV、MP4、MPE、MPG、MPEG、MTS、OGG、QT、RM、RMVB、 SWR TS、VOB、WMV、WEBM等视频格式上传</p>
                                </label>
                            </div>
                        </div>
                    </div>

                </div>
            </div>
        </div>
    </div>
    <!-- 进度条动画 -->
    <div class="loading_anime">
        <div>
            <div class="spinner">
                <div class="loading_num">
                    <span class="num">0.00</span><span class="present">%</span>
                </div>
                <div class="loading_msg">
                    上传影片的途中请勿关闭此窗口，否则将上传失败
                </div>
                <div class="spinner-container container1">
                    <div class="circle1"></div>
                    <div class="circle2"></div>
                    <div class="circle3"></div>
                    <div class="circle4"></div>
                </div>
                <div class="spinner-container container2">
                    <div class="circle1"></div>
                    <div class="circle2"></div>
                    <div class="circle3"></div>
                    <div class="circle4"></div>
                </div>
                <div class="spinner-container container3">
                    <div class="circle1"></div>
                    <div class="circle2"></div>
                    <div class="circle3"></div>
                    <div class="circle4"></div>
                </div>
            </div>
        </div>
    </div>
    <div class="myfooter">
        <div class="row">
            <div class="portlet-body form">
                <div class="form-body">
                    <div class="form-actions">
                        <div class="row">
                            <div class="col-md-12 text-center">
                                <button type="submit" class="btn green only-save">{fc_lang('仅保存')}</button>
                                <!--<button type="submit" class="btn green release-post">{fc_lang('发布并上架')}</button>-->
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

</form>
<script>
    var accessKeyId = "LTAIEvlPaoHFZQNK";
    var accessKeySecret = "Us5ShPEqXzVPCibT4qZvvYsQZAE7AD";
    var secretToken =  "CAISjgJ1q6Ft5B2yfSjIqabwfvaNibBDgamscUf33VYxY9hViLbesjz2IHtKenZsCegav/Q3nW1V7vsdlrBtTJNJSEnDKNF36pkS6g66eIvGvYmz5LkJ0ER9j4dcT0yV5tTbRsmkZu6/E67fUzKpvyt3xqSAO1fGdle5MJqPpId6Z9AMJGeRZiZHA9EkQGkPtsgWZzmzWPG2KUyo+B2yanBloQ1hk2hyxL2iy8mHkHrkgUb91/UeqvaaQPHmTbE1Z88kAofpgrcnJvKfiHYI0XUQqvcq1p4j0Czco9SQD2NW5xi7KOfO+rVtVlQiOPZlR/4c8KmszaQl57SOyJ6U1RFBMexQVD7YQI2wGDdS2XJ/9rwagAE4U2pFoP6wO5FjADB+jhNGY5bWzEUlxZcxU+e38udj2tc3+7X69V9b0fS7NRC7gsNLIrSZFEYgWgF6wM2weVvu5HJl/54c/GT9ItqqnjYE613kGWeJ6a7DqjWxZMKRs5F09mUTNsXFR+no9JTk+K/tdlA/1wuWOIvrAmPOsytzWw==";

    var uploader = new AliyunUpload.Vod({
        // 文件上传失败
        'onUploadFailed': function (uploadInfo, code, message) {
            console.log("onUploadFailed: file:" + uploadInfo.file.name + ",code:" + code + ", message:" + message);
        },
        // 文件上传完成
        'onUploadSucceed': function (uploadInfo) {
            $("input[name='videoid']").val(uploadInfo.videoId);
            console.log("onUploadSucceed: " + uploadInfo.file.name + ", endpoint:" + uploadInfo.endpoint + ", bucket:" + uploadInfo.bucket + ", object:" + uploadInfo.object);

            // 上传完成才可点击按钮
            $('.myfooter .btn').removeAttr('disabled');
            $(window.parent.document).find("a").unbind();

            $(".loading_msg").text("影片上传成功，已可保存此页面");
            $(".loading_anime").delay(2000).fadeOut("slow");
        },
        // 文件上传进度
        'onUploadProgress': function (uploadInfo, totalSize, loadedPercent) {
            console.log("onUploadProgress:file:" + uploadInfo.file.name + ", fileSize:" + totalSize + ", percent:" + (loadedPercent * 100.00).toFixed(2) + "%");

            // 显示进度百分比
            var load_present = (loadedPercent * 100.00).toFixed(2);
            $(".loading_anime .loading_num .num").text(load_present);
            if(load_present==100){

                $(".update-class-video").css("visibility","visible");
            }

        },
        // STS临时账号会过期，过期时触发函数
        'onUploadTokenExpired': function (uploadInfo) {
            console.log("onUploadTokenExpired");
            if (isVodMode()) {
                // 实现时，根据uploadInfo.videoId从新获取UploadAuth
                //实际环境中调用点播的刷新上传凭证接口，获取凭证
                //https://help.aliyun.com/document_detail/55408.html?spm=a2c4g.11186623.6.630.BoYYcY
                //获取上传凭证后，调用setUploadAuthAndAddress
                // uploader.resumeUploadWithAuth(uploadAuth);
            } else if (isSTSMode()) {
                // 实现时，从新获取STS临时账号用于恢复上传
                // uploader.resumeUploadWithSTSToken(accessKeyId, accessKeySecret, secretToken, expireTime);
            }
        },
        onUploadCanceled:function(uploadInfo)
        {
            console.log("onUploadCanceled:file:" + uploadInfo.file.name);
        },
        // 开始上传
        'onUploadstarted': function (uploadInfo) {
            if (isVodMode()) {
                if(!uploadInfo.videoId)//这个文件没有上传异常
                {
                    //mock 上传凭证，实际产品中需要通过接口获取
                    var uploadAuth = '';
                    var uploadAddress = '';
                    var videoId = '';
                    //实际环境中调用调用点播的获取上传凭证接口
                    //https://help.aliyun.com/document_detail/55407.html?spm=a2c4g.11186623.6.629.CH7i3X
                    //获取上传凭证后，调用setUploadAuthAndAddress
                    uploader.setUploadAuthAndAddress(uploadInfo, uploadAuth, uploadAddress,videoId);
                }
                else//如果videoId有值，根据videoId刷新上传凭证
                {
                    //mock 上传凭证 实际产品中需要通过接口获取
                    var uploadAuth = '';
                    var uploadAddress = '';
                    //实际环境中调用点播的刷新上传凭证接口，获取凭证
                    //https://help.aliyun.com/document_detail/55408.html?spm=a2c4g.11186623.6.630.BoYYcY
                    //获取上传凭证后，调用setUploadAuthAndAddress
                    uploader.setUploadAuthAndAddress(uploadInfo, uploadAuth, uploadAddress);
                }
            }
            else if (isSTSMode()) {
                var accessKeyId = "LTAIEvlPaoHFZQNK";
                var accessKeySecret = "Us5ShPEqXzVPCibT4qZvvYsQZAE7AD";
                var secretToken = "CAISjgJ1q6Ft5B2yfSjIqabwfvaNibBDgamscUf33VYxY9hViLbesjz2IHtKenZsCegav/Q3nW1V7vsdlrBtTJNJSEnDKNF36pkS6g66eIvGvYmz5LkJ0ER9j4dcT0yV5tTbRsmkZu6/E67fUzKpvyt3xqSAO1fGdle5MJqPpId6Z9AMJGeRZiZHA9EkQGkPtsgWZzmzWPG2KUyo+B2yanBloQ1hk2hyxL2iy8mHkHrkgUb91/UeqvaaQPHmTbE1Z88kAofpgrcnJvKfiHYI0XUQqvcq1p4j0Czco9SQD2NW5xi7KOfO+rVtVlQiOPZlR/4c8KmszaQl57SOyJ6U1RFBMexQVD7YQI2wGDdS2XJ/9rwagAE4U2pFoP6wO5FjADB+jhNGY5bWzEUlxZcxU+e38udj2tc3+7X69V9b0fS7NRC7gsNLIrSZFEYgWgF6wM2weVvu5HJl/54c/GT9ItqqnjYE613kGWeJ6a7DqjWxZMKRs5F09mUTNsXFR+no9JTk+K/tdlA/1wuWOIvrAmPOsytzWw==";

                uploader.setSTSToken(uploadInfo, accessKeyId, accessKeySecret,secretToken, "test");
            }
            console.log("onUploadStarted:" + uploadInfo.file.name + ", endpoint:" + uploadInfo.endpoint + ", bucket:" + uploadInfo.bucket + ", object:" + uploadInfo.object);
            // var strTem="";  // 临时变量

        }
        ,
        'onUploadEnd':function(uploadInfo){
            console.log("onUploadEnd: uploaded all the files");
        }
    });

    // 点播上传。每次上传都是独立的鉴权，所以初始化时，不需要设置鉴权
    // 临时账号过期时，在onUploadTokenExpired事件中，用resumeWithToken更新临时账号，上传会续传。
    var selectFile = function (event) {
        var endpoint = '';
        var bucket = '';
        var objectPre = '';
        var userData;
        if (isVodMode()) {
            userData = '{"Vod":{"UserData":{"IsShowWaterMark":"false","Priority":"7"}}}';
        } else {
            userData = '{"Vod":{"Title":"{$title}","Description":"{$content}","CateId":"84393486","Tags":"tag1,tag2,标签3","UserData":"user data"}}';
        }

        for(var i=0; i<event.target.files.length; i++) {
            console.log("add file: " + event.target.files[i].name);
            $('.video-msg').text( event.target.files[i].name);
            if (isVodMode()) {
                // 点播上传。每次上传都是独立的OSS object，所以添加文件时，不需要设置OSS的属性
                uploader.addFile(event.target.files[i], null, null, null, userData);
            } else if(isSTSMode()) {
                // STS的上传方式，需要在userData里指定Title
                var object = objectPre;
                // if(objectPre)
                // {
                //     object = objectPre +"/"+ event.target.files[i].name;
                // }
                uploader.addFile(event.target.files[i], endpoint, bucket, object , userData);
            }
        }
    };

    document.getElementById("files")
        .addEventListener('change', selectFile);

    // var textarea=document.getElementById("textarea");

    function start() {
        console.log("start upload.");
        uploader.startUpload();

        // 进度条弹出
        $(".loading_anime").fadeIn("slow");
        $(".update-class-video").css("cssText","visibility:hidden;");

        // 隐藏输入窗口
        $(window.parent.document).find("a").click(function(event){
            event.preventDefault();
        });
        $('.myfooter .btn').attr('disabled',"true");
    }

    function stop() {
        log("stop upload.");
        uploader.stopUpload();
        $(".update-class-video").css("cssText","visibility:visible;");
        $(".loading_anime").fadeOut();
    }

    function resumeWithToken() {
        console.log("resume upload with token.");
        var uploadAuth = '';
        var accessKeyId = "LTAIEvlPaoHFZQNK";
        var accessKeySecret = "Us5ShPEqXzVPCibT4qZvvYsQZAE7AD";
        var secretToken =  "CAISjgJ1q6Ft5B2yfSjIqabwfvaNibBDgamscUf33VYxY9hViLbesjz2IHtKenZsCegav/Q3nW1V7vsdlrBtTJNJSEnDKNF36pkS6g66eIvGvYmz5LkJ0ER9j4dcT0yV5tTbRsmkZu6/E67fUzKpvyt3xqSAO1fGdle5MJqPpId6Z9AMJGeRZiZHA9EkQGkPtsgWZzmzWPG2KUyo+B2yanBloQ1hk2hyxL2iy8mHkHrkgUb91/UeqvaaQPHmTbE1Z88kAofpgrcnJvKfiHYI0XUQqvcq1p4j0Czco9SQD2NW5xi7KOfO+rVtVlQiOPZlR/4c8KmszaQl57SOyJ6U1RFBMexQVD7YQI2wGDdS2XJ/9rwagAE4U2pFoP6wO5FjADB+jhNGY5bWzEUlxZcxU+e38udj2tc3+7X69V9b0fS7NRC7gsNLIrSZFEYgWgF6wM2weVvu5HJl/54c/GT9ItqqnjYE613kGWeJ6a7DqjWxZMKRs5F09mUTNsXFR+no9JTk+K/tdlA/1wuWOIvrAmPOsytzWw==";

        $(".update-class-video").css("visibility","hidden");
        $(".loading_anime").fadeIn();
        if (isVodMode()) {
            uploader.resumeUploadWithAuth(uploadAuth);
        } else if (isSTSMode()) {
            uploader.resumeUploadWithSTSToken(accessKeyId, accessKeySecret, secretToken);
        }
    }

    function clearInputFile()
    {
        var ie = (navigator.appVersion.indexOf("MSIE")!=-1);
        if( ie ){
            // var file = document.getElementById("files");
            var file = $("#files");
            var file2= file.cloneNode(false);
            file2.addEventListener('change', selectFile);
            file.parentNode.replaceChild(file2,file);
        }
        else
        {
            $("#files").val('');
            $('.video-msg').text('未选择任何档案');
            // document.getElementById("files").value = '';
        }

    }

    function clearList() {
        console.log("clean upload list.");
        uploader.cleanList();
    }

    function getList() {
        console.log("get upload list.");
        var list = uploader.listFiles();
        for (var i=0; i<list.length; i++) {
            console.log("file:" + list[i].file.name + ", status:" + list[i].state + ", endpoint:" + list[i].endpoint + ", bucket:" + list[i].bucket + ", object:" + list[i].object);
        }
    }

    function deleteFile() {
        if (document.getElementById("deleteIndex").value) {
            var index = document.getElementById("deleteIndex").value
            console.log("delete file index:" + index);
            uploader.deleteFile(index);
        }
    }

    function cancelFile() {
        if (document.getElementById("cancelIndex").value) {
            var index = document.getElementById("cancelIndex").value
            console.log("cancel file index:" + index);
            uploader.cancelFile(index);
        }
    }

    function resumeFile() {
        if (document.getElementById("resumeIndex").value) {
            var index = document.getElementById("resumeIndex").value
            console.log("resume file index:" + index);
            uploader.resumeFile(index);
        }
    }

    function clearLog() {
        textarea.options.length = 0;
    }


    function isVodMode() {
        var uploadAuth = '';
        return (uploadAuth && uploadAuth.length > 0);
    }

    function isSTSMode() {
        var secretToken = "CAISjgJ1q6Ft5B2yfSjIqabwfvaNibBDgamscUf33VYxY9hViLbesjz2IHtKenZsCegav/Q3nW1V7vsdlrBtTJNJSEnDKNF36pkS6g66eIvGvYmz5LkJ0ER9j4dcT0yV5tTbRsmkZu6/E67fUzKpvyt3xqSAO1fGdle5MJqPpId6Z9AMJGeRZiZHA9EkQGkPtsgWZzmzWPG2KUyo+B2yanBloQ1hk2hyxL2iy8mHkHrkgUb91/UeqvaaQPHmTbE1Z88kAofpgrcnJvKfiHYI0XUQqvcq1p4j0Czco9SQD2NW5xi7KOfO+rVtVlQiOPZlR/4c8KmszaQl57SOyJ6U1RFBMexQVD7YQI2wGDdS2XJ/9rwagAE4U2pFoP6wO5FjADB+jhNGY5bWzEUlxZcxU+e38udj2tc3+7X69V9b0fS7NRC7gsNLIrSZFEYgWgF6wM2weVvu5HJl/54c/GT9ItqqnjYE613kGWeJ6a7DqjWxZMKRs5F09mUTNsXFR+no9JTk+K/tdlA/1wuWOIvrAmPOsytzWw==";
        if (!isVodMode()) {
            if (secretToken && secretToken.length > 0) {
                return true;
            }
        }
        return false;
    }
//提交判断
    $(function () {
        $(".only-save").click(function () {
            var videoid = $("input[name='videoid']").val();
            if(!videoid){
                alert("视频不能为空");
                return false;
            }
            return true;
        });
    });
</script>


{template nfooter.html}